import 'dart:convert';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_cupertino_date_picker/flutter_cupertino_date_picker.dart';
import 'package:provider/provider.dart';
import 'package:shopping_list/common/utils.dart';
import 'package:shopping_list/components/form_text.dart';
import 'package:shopping_list/components/item.dart';
import 'package:shopping_list/components/text_item.dart';
import 'package:shopping_list/components/toast.dart';
import 'package:shopping_list/global.dart';
import 'package:shopping_list/manager/main_manager.dart';
import 'package:shopping_list/pages/edit.dart';

class DetailPage extends StatefulWidget {
  DetailPage({Key key, this.id, this.data}) : super(key: key);
  final data;
  final id;

  @override
  State<StatefulWidget> createState() => _DetailPageState();
}

class _DetailPageState extends State<DetailPage> {
  var _data;

  List _goodsList = [];

  @override
  void initState() {
    setState(() {
      _data = widget.data;
    });

    _goodsList = json.decode(_data['goods']);

    super.initState();
  }

  void removeGoods(int index) {
    setState(() => {_goodsList.removeAt(index)});
  }

  List<Widget> renderGoodsList(update) {
    List<Widget> goodsWidgetList = [];
    for (int i = 0; i < _goodsList.length; i++) {
      Map goods = _goodsList[i];
      goodsWidgetList.add(
        Row(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            IconButton(
              icon: Icon(
                goods['checked'] == '1'
                    ? Icons.check_circle
                    : Icons.check_circle_outline,
              ),
              onPressed: () {
                setState(() {
                  goods['checked'] = goods['checked'] == '1' ? '0' : '1';
                  _data['goods'] = json.encode(_goodsList);
                  update(widget.id.toString(), json.encode(_data));
                });
              },
            ),
            Expanded(
              child: Container(
                child: Text(
                  goods['name'],
                  style: TextStyle(fontSize: 20),
                ),
              ),
            )
          ],
        ),
      );
    }

    return goodsWidgetList;
  }

  @override
  Widget build(BuildContext context) {
    MainManager _mainManager = Provider.of<MainManager>(context);

    return Scaffold(
      appBar: AppBar(
        iconTheme: IconThemeData(color: Global.backgroundColor),
        toolbarHeight: 50,
        elevation: 0,
        title: Text(
          "购物清单",
          maxLines: 1,
          overflow: TextOverflow.ellipsis,
          style: TextStyle(
            color: Global.backgroundColor,
            fontSize: 15,
          ),
        ),
        actions: <Widget>[
          Offstage(
            offstage: widget.id == '000',
            child: IconButton(
              icon: Icon(Icons.delete),
              tooltip: '删除',
              onPressed: () {
                Utils.showConfirmDialog(
                  context: context,
                  content: '确认删除该清单？',
                  confirmCallback: () {
                    _mainManager.delete(widget.id.toString());
                    Navigator.pop(context);
                  },
                  showCancelButton: true,
                );
              },
            ),
          ),
          IconButton(
            icon: Icon(Icons.edit),
            tooltip: '编辑',
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => EditPage(id: widget.id, data: _data),
                ),
              );
            },
          ),
        ],
      ),
      body: Container(
        width: MediaQuery.of(context).size.width,
        height: MediaQuery.of(context).size.height,
        decoration: BoxDecoration(color: Global.cardBackgroundColor),
        child: SingleChildScrollView(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.start,
            children: <Widget>[
              Container(
                padding: EdgeInsets.all(13),
                child: Text(
                  '清单基本信息',
                  style: TextStyle(
                    color: Global.fontColor.withOpacity(0.8),
                    fontSize: 19,
                    fontWeight: FontWeight.w600,
                  ),
                ),
              ),
              Container(
                width: MediaQuery.of(context).size.width,
                padding: EdgeInsets.all(14),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Text(
                      '用途：',
                      style: TextStyle(
                        color: Global.fontColor,
                        fontWeight: FontWeight.w500,
                        fontSize: 16,
                      ),
                    ),
                    Text(
                      widget.data['use'],
                      style: TextStyle(
                        color: Global.fontColor,
                        fontWeight: FontWeight.w400,
                        fontSize: 14,
                      ),
                    ),
                    SizedBox(height: 10),
                    Text(
                      '购买渠道：',
                      style: TextStyle(
                        color: Global.fontColor,
                        fontWeight: FontWeight.w500,
                        fontSize: 16,
                      ),
                    ),
                    Text(
                      widget.data['channel'],
                      style: TextStyle(
                        color: Global.fontColor,
                        fontWeight: FontWeight.w400,
                        fontSize: 14,
                      ),
                    ),
                    SizedBox(height: 10),
                    Text(
                      '采购日期：',
                      style: TextStyle(
                        color: Global.fontColor,
                        fontWeight: FontWeight.w500,
                        fontSize: 16,
                      ),
                    ),
                    Text(
                      widget.data['date'],
                      style: TextStyle(
                        color: Global.fontColor,
                        fontWeight: FontWeight.w400,
                        fontSize: 14,
                      ),
                    ),
                    SizedBox(height: 10),
                    Text(
                      '备注：',
                      style: TextStyle(
                        color: Global.fontColor,
                        fontWeight: FontWeight.w500,
                        fontSize: 16,
                      ),
                    ),
                    Text(
                      widget.data['remark'],
                      style: TextStyle(
                        color: Global.fontColor,
                        fontWeight: FontWeight.w400,
                        fontSize: 14,
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                padding: EdgeInsets.all(13),
                child: Text(
                  '商品',
                  style: TextStyle(
                    color: Global.fontColor.withOpacity(0.8),
                    fontSize: 19,
                    fontWeight: FontWeight.w600,
                  ),
                ),
              ),
              Container(
                child: Column(
                  children: renderGoodsList(_mainManager.update),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}
